<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<link rel="stylesheet" href="./framework/font-awesome-4.7.0/css/font-awesome.min.css">
		<link rel="stylesheet" href="./framework/reset.css">
		<link rel="stylesheet" href="./framework/common.css">
		<link rel="stylesheet" href="./css/feedbackList.css">
		<title>东软环保公众监督系统-公众监督员端-反馈信息列表</title>
		<script src="../js/axios.js"></script>
	</head>
	<body>
		<!-- 总容器 -->
		<div class="wrapper">
			<div class="header-box">
				<header>
					<i class="fa fa-angle-left" onclick="history.go(-1)"></i>
					<p>历史反馈信息列表</p>
					<i class="fa fa-th" onclick="location.href='selectGrid.html'"></i>
				</header>
				<div class="top-ban"></div>
				<img src="./img/header.png" onclick="reFlash();"">
			</div>

			<ul id=" feedBackList">

				</ul>
				<div id="nextPage" style="text-align: center;color: #333; background-color: aquamarine;font-size: 18px;"
					onclick="loadData();">
					点击查看更多
				</div>
			</div>
	</body>
</html>
<script>
	let lastAfId = -1;
	let token = localStorage.getItem("token");
	// 创建请求配置对象
	const config = {
		headers: {
			'token': token, // 设置认证令牌
			'Content-Type': 'application/json' // 设置内容类型为JSON
		}
	};

	function loadData() {
		let pageSize = 5;
		let url = "http://localhost:8080/aqi/findBackAll?pageSize=" + pageSize + "&lastAfId=" + lastAfId;
		axios.get(url, config).then((r) => {
			if (r.data.ok) {
				let feedbacks = r.data.data.list;
				lastAfId = feedbacks[feedbacks.length - 1].id;
				let innerHTML = document.getElementById(" feedBackList").innerHTML;
				for (var i = 0; i < feedbacks.length; i++) {
					let feedback = feedbacks[i];
					innerHTML = innerHTML + " <li>\n" +
						" \t<div>\n" +
						" \t\t<i style=\"background-color: " + feedback.color + ";\">" + feedback.chineseExplain +
						"</i>\n" +
						" \t\t<span>" + feedback.afDate + "\t" + feedback.afTime + "</span>\n" +
						" \t</div>\n" +
						" \t<div>" + feedback.provinceName + "</div>\n" +
						" \t<div>" + feedback.cityName + "</div>\n" +
						" </li>"
				}
				document.getElementById(" feedBackList").innerHTML = innerHTML;
			} else {
				let feedbacks = r.data.data.list;
				if (feedbacks.length == 0) {
					document.getElementById("nextPage").innerHTML = "我是有底线的";
					return;
				}
			}
		});
	}
	loadData();

	function reFlash() {
		document.getElementById(" feedBackList").innerHTML = "";
		lastAfId = -1;
		loadData();
		document.getElementById("nextPage").innerHTML = "点击加载更多";
	}
</script>